import 'dart:math';

import 'package:flutter/material.dart';
import 'package:t3_data_service/biz_data_source/map/address/city_pick/city_pick.dart';
import 'package:t3_data_service/biz_data_source/map/address/poi_search/model/t3_poi_enums.dart';
import 'package:t3_foundation/t3_foundation.dart';
import 'package:uikit/uikit.dart';

import '../../configs/map_select_config.dart';
import '../../poi_search/model/const.dart';
import '../view_model/map_selected_header_view_model.dart';

class MapSelectedHeaderWidget extends StatelessWidget {
  final T3POIType type;
  final CityScope cityScope;
  final MapSelectedHeaderViewModel viewModel;
  final MapSelectConfig config;
  final VoidCallback clickBack;
  final VoidCallback clickCity;
  final VoidCallback clickSearchBar;
  final VoidCallback clickCancel;

  const MapSelectedHeaderWidget({
    Key? key,
    required this.type,
    required this.cityScope,
    required this.viewModel,
    required this.config,
    required this.clickBack,
    required this.clickCity,
    required this.clickSearchBar,
    required this.clickCancel,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: const BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.only(
          bottomLeft: Radius.circular(12),
          bottomRight: Radius.circular(12),
        ),
      ),
      height: 64,
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Container(
            width: InputConst.kBackButtonWidth,
            height: 40,
            margin: const EdgeInsets.only(top: 4),
            child: IconButton(
                onPressed: clickBack,
                icon: T3Image.t3assets(T3AssetsName.icon_back_elderly_slices)),
          ),
          Expanded(
            child: Container(
              decoration: const BoxDecoration(
                color: Color(0xfff7f8fc),
                borderRadius: BorderRadius.all(Radius.circular(20)),
              ),
              height: 40,
              child: Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Container(
                    margin: const EdgeInsets.fromLTRB(12, 0, 9, 0),
                    decoration: BoxDecoration(
                        color: (type == T3POIType.start)
                            ? const Color(0xff39bd91)
                            : const Color(0xffff8533),
                        borderRadius: BorderRadius.circular(3)),
                    width: 6,
                    height: 6,
                  ),
                  T3GestureDetector(
                    onTap: clickCity,
                    child: Row(
                      children: [
                        Obx(() {
                          final cityName =
                              showCityName(viewModel.city.value.city ?? '');
                          return Container(
                            constraints: const BoxConstraints(
                              maxWidth: 45, // 设置最大宽度
                            ),
                            child: Text(
                              cityName,
                              style: const TextStyle(fontSize: 14),
                              overflow: TextOverflow.ellipsis,
                              maxLines: 1,
                            ),
                          );
                        }),
                        const SizedBox(
                          width: 4,
                        ),
                        T3Image.t3assets(T3AssetsName.icon_downmore_lucy),
                        const SizedBox(
                          width: 8,
                        ),
                        Container(
                          width: 1,
                          height: 12,
                          decoration: BoxDecoration(
                              color: const Color(0xFFD2D3D6).withOpacity(0.5)),
                        ),
                        const SizedBox(
                          width: 8,
                        ),
                      ],
                    ),
                  ),
                  Expanded(
                    child: T3GestureDetector(
                      onTap: () {
                        clickSearchBar();
                      },
                      child: Obx(() {
                        var title = config.keyword ?? type.mapPlaceHolder();
                        if (viewModel.currentPOI.value.name != null) {
                          title = viewModel.currentPOI.value.name ??
                              type.mapPlaceHolder();
                        }
                        return Text(
                          title,
                          style: const TextStyle(
                            color: Color(0xffa5a7ad),
                            fontWeight: LucyFonts.regular,
                            fontSize: 14,
                          ),
                          maxLines: 1,
                          overflow: TextOverflow.ellipsis,
                        );
                      }),
                    ),
                  ),
                  const SizedBox(
                    width: 4,
                  ),
                ],
              ),
            ),
          ),
          const SizedBox(
            width: 12,
          ),
          T3GestureDetector(
            onTap: () {
              clickCancel();
            },
            child: Container(
              height: 40,
              width: 40,
              margin: const EdgeInsets.only(top: 4),
              child: const Center(
                child: Text(
                  '取消',
                  style: TextStyle(
                      color: LucyColors.lucy_747881,
                      fontSize: LucyFonts.size_14,
                      fontWeight: LucyFonts.regular),
                ),
              ),
            ),
          ),
          const SizedBox(
            width: 12,
          ),
        ],
      ),
    );
  }

  String showCityName(String named) {
    var name = named;
    if (name.endsWith('市')) {
      name = name.substring(0, name.length - 1);
    }
    return name;
  }
}
